<template>
    <div class="login-wrap">
        <div class="login-cent">
            <div class="login-cent-right">
                <p>家庭医生后台管理系统</p>
                <div class="login-cent-right-img"><img src="../../assets/img/login1.png" /></div>
            </div>
        </div>

        <div class="ms-login">
            <img src="../../assets/img/logo.png.jpg">
            <div class="ms-title">欢迎登录</div>
            <el-form label-width="0px" class="ms-content">
                <el-form-item prop="username">
                    <div class="content-text">
                        <el-input v-model="dname" placeholder="username">
                            <!-- <el-button slot="prepend" icon="el-icon-lx-people"></el-button> -->
                        </el-input>
                    </div>
                </el-form-item>
                <el-form-item prop="password">
                    <el-input type="password" placeholder="password" v-model="dpassword">
                        <!-- <el-button slot="prepend" icon="el-icon-lx-lock"></el-button> -->
                    </el-input>
                </el-form-item>
                <div class="login-yes">
                    <el-checkbox v-model="checked">我已阅读并同意&nbsp;&nbsp;&nbsp;<a href="/#/404">《用户隐私政策》</a></el-checkbox>
                </div>
                <div class="login-btn">
                    <el-button type="primary" @click="submitForm()">登录</el-button>
                </div>
                <p class="login-tips">忘记密码请联系管理员</p>
            </el-form>
        </div>
    </div>
</template>

<script>
import axios from "axios";
export default {
    data: function () {
        return {
            dname: "",
            dpassword: "",
            checked: false
        };
    },
    methods: {
        submitForm() {
            if (this.checked === false) {
                this.$message({
                    type: 'success',
                    message: '请同意服务条款'
                });
                return
            } else {
                axios({
                    url: "api/doctor/login",
                    method: "POST",
                    params: {
                        doctorName: this.dname,
                        doctor_pwd: this.dpassword,
                    },
                }).then((res) => {
                  console.log(res);
                if(res.data.code===200){
                     this.$router.push({
                     path:'/control',
                 })
                 } 
                 else if(res.data.code===250){
                    this.$message({
                    type: 'success',
                    message: '账号错误'
                })
                 }
                 else if(res.data.code===251){
                    this.$message({
                    type: 'success',
                    message: '密码错误'
                })
                 }
                });

            }

           



        },
    },
};
</script>

<style scoped >
.ms-login > img {
    width: 40px;
    height: 40px;
    margin-left: 150px;
}
/* 家庭医生 */
.login-cent-right > p {
    color: white;
    position: absolute;
    left: 25px;
    top: 23px;
}
/* 登录页面图片 */
.login-cent-right-img {
    position: absolute;
    left: 110px;
    bottom: 170px;
}
.login-cent-right {
    position: absolute;
    width: 600px;
    height: 660px;
    background-color: #2984f8;
}
/* 居中父级div */
.login-cent {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 8px;
    overflow: hidden;
    width: 1200px;
    height: 660px;
    background-color: #ffffff;
}
.login-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    background-color: #f2f7fb;
    background-size: 100%;
}
.ms-title {
    width: 100%;
    line-height: 50px;
    text-align: center;
    font-size: 30px;
    color: #000;
    /* 欢迎登录下的线 */
    /* border-bottom: 1px solid #ddd; */
}
.ms-login {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 350px;
    /* 控制登录表单 */
    margin: -110px 0 0 115px;
    border-radius: 5px;
    background: rgba(255, 255, 255, 1);
    overflow: hidden;
}
.ms-content {
    padding: 10px 10px;
}
/* 设置登录按钮 */
.login-btn button {
    width: 335px;
    height: 44px;
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: #1877f2;
}
.login-tips {
    font-size: 15px;
    line-height: #000;
    color: #c6c9ce;
    margin-left: 90px;
}
a {
    color: #1877f2;
}
</style>